<template>
    <view class="map-container">
        <!--@callouttap='callouttap'-->
        <map id='map'
             class="map"
             :latitude="latitude" :longitude="longitude"
             show-compass="true"
             show-location="true"
             enable-3D="true"
             :markers="markers"
             :circles="circles"
             :scale="scale"
        ></map>
        <u-button @click="calc">计算距离</u-button>
        <u-button @click="sign" type="success" :disabled="!signIn">签到</u-button>
        <div>{{distance}}</div>
        <div>{{address.street}}-{{address.area}}-{{address.address}}</div>
    </view>
</template>

<script>
    import setting from './setting'
    import QQMapWX from "@/libs/qqmap-wx-jssdk.js"

    export default {
        name: "map2",
        data: () => {
            return {
                timer: null,
                longitude: '120.245719',//经度
                latitude: '31.544857',//纬度
                scale: 17,//缩放
                markers: setting.markers,
                circles: setting.circles,
                distance: 0,
                signIn: false,
                address:{
                    province: "",
                    city: "",
                    area: "",
                    street: "",
                    address: "",
                }
            }
        },
        async onLoad() {
            let _ = this
            _.getAddress()
            _.getUserLocation()
            _.timer = setInterval(() => {
                _.getUserLocation()
            }, 3000)
        },
        beforeDestroy(){
            let _ = this
            _.clearTimer()
        },
        methods: {
            getUserLocation() {
                let _ = this
                uni.getLocation({
                    type: 'gcj02',
                    success: function (res) {
                        console.log('当前位置的经度：' + res.longitude)
                        console.log('当前位置的纬度：' + res.latitude)
                        _.distance = _.calcDistance(31.544857, 120.245719, res.latitude, res.longitude).m
                        if(_.distance<=35) _.signIn=true
                        else _.signIn=false
                    }
                })
            },
            getAddress(){
                let _ = this
                let location = {
                    longitude: 0,
                    latitude: 0
                }
                uni.getLocation({
                    type: 'gcj02',
                    success: function (res) {
                        location.longitude = res.longitude;
                        location.latitude = res.latitude;
                        const qqmapsdk = new QQMapWX({
                            key: 'YK2BZ-FBBWV-S2OPO-557KX-KUNIQ-36BBV'
                        });
                        qqmapsdk.reverseGeocoder({
                            location,
                            success(response) {
                                let info = response.result;
                                console.log(info);
                                _.address.province = info.address_component.province;
                                _.address.city = info.address_component.city;
                                _.address.area = info.address_component.district;
                                _.address.street = info.address_component.street;
                                _.address.address = info.address;
                                console.log('address', _.address)
                            },
                        })
                    }
                })
            },
            calcDistance(la1, lo1, la2, lo2) {
                let La1 = la1 * Math.PI / 180.0;
                let La2 = la2 * Math.PI / 180.0;
                let La3 = La1 - La2;
                let Lb3 = lo1 * Math.PI / 180.0 - lo2 * Math.PI / 180.0;
                let s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(La3 / 2), 2) + Math.cos(La1) * Math.cos(La2) * Math.pow(Math.sin(Lb3 / 2), 2)));
                s = s * 6378.137;
                s = Math.round(s * 10000) / 10000;

                return {
                    km: s,
                    m: Math.round(s * 1000)
                };
            },
            calc() {
                let _ = this
                _.distance = _.calcDistance(31.544857, 120.245719, 31.544052, 120.2458).m
                console.log(_.calcDistance(31.544857, 120.245719, 31.544052, 120.2458))
            },
            sign() {
                let _ = this
            },
            clearTimer() {
                clearInterval(this.timer);
                this.timer = null;
            },
        }
    }
</script>

<style lang="scss" scope>
    @import 'index.scss';
</style>
